<template>
    <div>
        <table>
            <tr>
                <td>学生名字</td>
                <td>学生性别</td>
                <td>个人简介</td>
                <td>称号</td>
                <td>负责老师</td>
            </tr>
            <tr v-for="stu in stu_list" :key="stu.id">
                <td><button @click="rout(stu.id)">{{stu.stu_name}}</button></td>
                <td>{{stu.stu_sex}}</td>
                <td>{{stu.stu_icon}}</td>
                <td>{{stu.stu_describe}}</td>
                <td>{{stu.teacher}}</td>
            </tr>
        </table>
        <button @click="up">上一页</button>
        <button v-for="p in page_list" :key="p.id" @click="jump(p)">{{p}}</button>
        <button @click="domp">下一页</button>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            stu_list:[],
            base_url:'http://127.0.0.1:8000/',
            num:1,
            page_list:[],
            page_sum:0,
        }
    },
    methods: {
        up(){
            if (this.num>1){
                this.num --
                this.get_index()
            }
        },
        domp(){
               if (this.num<this.page_sum){
                this.num ++
                this.get_index()
            } 
        },
        jump(p){
             this.num=p
             this.get_index()

        },
        rout(id){
            this.$router.push({
                path:'/desc',
                query:{'id':id}
            })
        },
        get_index(){
            let key =sessionStorage.getItem('key')
            if(key){
                axios(this.base_url+'app01/student?num='+this.num).then(res=>{
                console.log(res.data)
                this.stu_list=res.data.data
                this.page_list =res.data.page_list
                this.page_sum =res.data.page_sum
            })
            }else{
                this.$router.push({
                    name:'Login'
                })
            }
            
        }
    },
    created() {
        this.get_index()
    }
}
</script>

<style scoped>

</style>
